今回は、文字や画像を選択できないホームページの作成方法を紹介します。通常のホームページでは、マウスのドラッグにより文字や画像を選択し、［Ctrl］＋［C］キーで内容をコピーすることが可能です。しかし、ちょっと工夫するだけで、これを禁止することができます。無断でコピーされたくないホームページなどに活用してみるとよいでしょう。
まずは、文字を選択しようとすると、「ここは選択禁止です」というメッセージを表示する方法を紹介します。このテクニックは、要素を選択した瞬間に動作するイベント「onSelectStart」を利用すると簡単に作成できます。メッセージを表示する場合であれば、alertコマンドで表示したい文章をカッコ内に記述するだけでOK。これで、とりあえずは文字のコピーを防ぐことができます。
<P onSelectStart="alert('ここは選択禁止です')">
ここを選択しようとすると…
</P>
メッセージを表示するのではなく、単純に選択を禁止する場合は、「onSelectStart」イベントに「return false」を指定します。すると、文字を選択しようとした瞬間に“何も実行しないJavaScript”が実行され、結局のところ、文字の選択を不可能にすることができます。
<P onSelectStart="return false">
しかし、こちらの文章は選択できません。<BR>
もちろん、コピーすることも不可能です。
</P>
もちろん、「onSelectStart」イベントは、P以外のタグに指定することも可能です。たとえば、BODYタグに「onSelectStart="return false"」を指定すると、ページ全体を選択不可にすることができます。ただし、これらのテクニックは、JavaScriptをOFFにしているブラウザやNetscapeには通用しないため、完璧なコピー防御策とはなりません。簡易的な著作権保護機能と割り切って活用していくとよいでしょう。
<BODY onSelectStart="return false">
